<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/commons/global.jsp" %>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/commons/basejs.jsp" %>
<meta http-equiv="X-UA-Compatible" content="edge" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>资源管理</title>
    <script type="text/javascript">
    var dataGrid;
    var url;
    $(function() {
        dataGrid = $('#dataGrid').treegrid({
            url : '${path}/resource/queryResourceByList.do',
            idField : 'id',
            treeField : 'name',
			rownumbers: true,
			animate: true,
			collapsible: true,
			pagination: true,
			fitColumns: true,
            pageSize : 10,
            pageList : [10],
            loadMsg	:"玩命加载中...",
            frozenColumns : [ [ {
                title : '编号',
                field : 'id',
                width : 240,
                hidden:true
            } ] ],
            columns : [ [ 
			{
                width : '150',
                title : '名称',
                field : 'name',
                sortable : true
            }, {
                width : '180',
                title : '地址',
                field : 'url',
                sortable : true
            },{
                width : '120',
                title : '图标',
                field : 'iconCls',
            },{
                width : '80',
                title : '父ID',
                field : 'pid',
                hidden : true
            },{
                width : '80',
                title : '类型',
                field : 'resource_type',
                formatter : function(value, row, index) {
                	switch (value) {
                    case '0':
                        return '菜单';
                    case '1':
                        return '按钮/列表';
                    case '2':
                		return '链接';
                	}
                }
            },{
                width : '80',
                title : '权限类型',
                field : 'perimssion_type',
                formatter : function(value, row, index) {
                	switch (value) {
                    case '0':
                        return 'roles';
                    case '1':
                        return 'perms';
                    case '2':
                        return 'anon';
                    case '3':
                        return 'authc';
                    }
                }
            },{
                width : '150',
                title : '创建时间',
                field : 'create_time',
                sortable : true
            }, {
                width : '150',
                title : '修改时间',
                field : 'update_time',
                sortable : true
            }] ],
            toolbar : '#toolbar',
        });
        //加载菜单节点
        initGetTreeMenu();
    });
	function initGetTreeMenu(){
		$('#menu_pid').combotree({
        	url:'${base}/resource/getTreeMenu.do'
        });
	}

    function addFun() {
        $('#dlg_win').dialog('open').dialog('setTitle','新增');
        $('#fm_win').form('clear');
        url = '${base}/resource/add.do';
    }
    function editFun() {
    	var row = $('#dataGrid').treegrid('getSelected');
        if (row){
        	var treeObject=$('#dataGrid').treegrid('getParent',row.id);
        	if(treeObject!=null){
        		$('#menu_pid').combotree('setValue',treeObject.id);
        	}
            $('#dlg_win').dialog('open').dialog('setTitle','编辑');
            $('#fm_win').form('load',row);
            url = '${base}/resource/update.do?id='+row.id;
        }
    }
    
    function saveResource(){
    	if($('#fm_win').form('validate')){
    		$.post(url, $('#fm_win').serialize(), function (data) {
    			var result=eval("("+data+")");
                if (result.code!='0') {
                	$.messager.show({
                        title: 'Error',
                        msg: result.errorMsg
                    });
                }else {
                    $('#dlg_win').dialog('close');        // close the dialog
                    $('#dataGrid').treegrid('reload'); // reload the user data
                    initGetTreeMenu();
                }                   
            });
    	}
    }
    
    function deleteFun() {
        var row = $('#dataGrid').datagrid('getSelected');
        if (row){
            $.messager.confirm('Confirm','删除可能会引起数据错乱,确定要删除吗?',function(r){
                if (r){
                    $.post('${base}/resource/delete.do',{id:row.id},function(result){
                    	$('#dataGrid').datagrid('reload');    // reload the user data
                        if (result.code=='0'){
                            $('#dataGrid').treegrid('reload');    // reload the user data
                            initGetTreeMenu();
                        } else {
                            $.messager.show({    // show error message
                                title: 'Error',
                                msg: result.errorMsg
                            });
                        }
                    },'json');
                }
            });
        }
    }
    </script>
</head>
<body class="easyui-layout" data-options="fit:true,border:false">
    <div data-options="region:'center',border:false" >
        <table id="dataGrid" data-options="fit:true,border:false"></table>
    </div>
    <div id="toolbar">
    	<c:if test="${fn:contains(roleAuth,'/resource/add.do')}">
    	<a onclick="addFun();" href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-add'">添加</a>
    	</c:if>
    	<c:if test="${fn:contains(roleAuth,'/resource/update.do')}">
    	<a onclick="editFun();" href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-edit'">编辑</a>
    	</c:if>
    	<c:if test="${fn:contains(roleAuth,'/resource/delete.do')}">
    	<a onclick="deleteFun();" href="javascript:void(0);" class="easyui-linkbutton" data-options="plain:true,iconCls:'icon-remove'">删除</a>
    	</c:if>
    </div>
    <!-- 弹窗 -->
    <div id="dlg_win" class="easyui-dialog"  style="padding:10px 20px;width: 400px;height: 350px;"
            closed="true" buttons="#dlg-buttons_win">
        <div class="ftitle">详细信息</div>
        <form id="fm_win" method="post" novalidate>
            <div class="fitem">
                <label>资源名称:</label>
                <input name="name" class="easyui-textbox" required="true">
            </div>
            <div class="fitem">
                <label>地址:</label>
                <input name="url" class="easyui-textbox" style="width: 260px;">
            </div>
            <div class="fitem">
                <label>图标:</label>
                <input name="iconCls" class="easyui-textbox" required="true">
            </div>
            <div class="fitem">
                <label>父节点:</label>
                <input name="pid" id="menu_pid" class="easyui-combotree" data-options="panelHeight:'auto'" >
            </div>
            <div class="fitem">
                <label>排序:</label>
                <input name="seq" class="easyui-numberspinner" required="true" data-options="min:1,max:100,editable:false">
            </div>
            <div class="fitem">
                <label>资源类型:</label>
                <select name="resource_type" class="easyui-combobox" panelHeight="auto" required="true">
                	<option value="0">菜单</option>
                	<option value="1">按钮/列表</option>
                	<option value="2">链接</option>
                </select>
            </div>
            <div class="fitem">
                <label>权限类型:</label>
                <select name="perimssion_type" class="easyui-combobox" panelHeight="auto" required="true">
                	<option value="0">roles</option>
                	<option value="1">perms</option>
                	<option value="2">anon</option>
                	<option value="3">authc</option>
                </select>
            </div>
        </form>
    </div>
    <div id="dlg-buttons_win">
        <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="saveResource()" style="width:90px">保存</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg_win').dialog('close')" style="width:90px">取消</a>
    </div>
</html>
<script type="text/javascript">
(function($){
	function pagerFilter(data){
        if ($.isArray(data)){    // is array  
            data = {  
                total: data.length,  
                rows: data  
            }  
        }
        var dg = $(this);  
		var state = dg.data('treegrid');
        var opts = dg.treegrid('options');  
        var pager = dg.treegrid('getPager');  
        pager.pagination({  
            onSelectPage:function(pageNum, pageSize){  
                opts.pageNumber = pageNum;  
                opts.pageSize = pageSize;  
                pager.pagination('refresh',{  
                    pageNumber:pageNum,  
                    pageSize:pageSize  
                });  
                dg.treegrid('loadData',state.originalRows);  
            }  
        });  
        if (!state.originalRows){
        	state.originalRows = data.rows;
        }
        var topRows = [];
        var childRows = [];
        $.map(state.originalRows, function(row){
        	row._parentId ? childRows.push(row) : topRows.push(row);
        });
        data.total = topRows.length;
        var start = (opts.pageNumber-1)*parseInt(opts.pageSize);  
        var end = start + parseInt(opts.pageSize);  
		data.rows = $.extend(true,[],topRows.slice(start, end).concat(childRows));
		return data;
	}

	var appendMethod = $.fn.treegrid.methods.append;
	var loadDataMethod = $.fn.treegrid.methods.loadData;
	$.extend($.fn.treegrid.methods, {
		clientPaging: function(jq){
			return jq.each(function(){
				var state = $(this).data('treegrid');
				var opts = state.options;
				opts.loadFilter = pagerFilter;
				var onBeforeLoad = opts.onBeforeLoad;
				opts.onBeforeLoad = function(row,param){
					state.originalRows = null;
					onBeforeLoad.call(this, row, param);
				}
				$(this).treegrid('loadData', state.data);
				$(this).treegrid('reload');
			});
		},
		loadData: function(jq, data){
			jq.each(function(){
				$(this).data('treegrid').originalRows = null;
			});
			return loadDataMethod.call($.fn.treegrid.methods, jq, data);
		},
		append: function(jq, param){
			return jq.each(function(){
				var state = $(this).data('treegrid');
				if (state.options.loadFilter == pagerFilter){
					$.map(param.data, function(row){
						row._parentId = row._parentId || param.parent;
						state.originalRows.push(row);
					});
					$(this).treegrid('loadData', state.originalRows);
				} else {
					appendMethod.call($.fn.treegrid.methods, jq, param);
				}
			})
		}
	});

})(jQuery);

$(function(){
	$('#dataGrid').treegrid().treegrid('clientPaging');
})
</script>